<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
	<Link rel="stylesheet" type="text/css" href="../../style/style.css" />
<link rel="stylesheet" href="../../css/elementUI.css" />


<style>
	*{
		padding: 0;
		margin: 0;
	}
	
	html,body,#app{
		width: 100%;
		height: 100%;
		font-size: 14px;
	}

	
</style>
</head>
<body>
	<div id="app">
			<!--      主体        -->
			<DIV class="t">
				<TABLE cellSpacing="0" cellPadding="0" width="100%">
					<TR class="tr2" align="center">
						<TD colSpan="2">论坛</TD>
						<TD style="WIDTH: 10%;">主题</TD>
						<TD style="WIDTH: 30%">最后发表</TD>
					</TR>

					<template v-for="b in boards">
						<!--       主版块       -->
						<TR class="tr3">
							<TD colspan="4">{{b.boardname}}</TD>
						</TR>
						<!--       子版块       -->
						<TR class="tr3" v-for="sub in b.children">
							<TD width="5%">&nbsp;</TD>
							<TH align="left">
								<IMG src="../../././image/board.gif">
								<A :href="'list.html?bid='+sub.id">{{sub.boardname}}</A>
							</TH>
							<TD align="center">??</TD>
							<TH>
				<SPAN>
					<A href="detail.html">???</A>
				</SPAN>
								<BR/>
								<SPAN>??</SPAN>
								<SPAN class="gray">[ 2007-07-30 10:25 ??]</SPAN>
							</TH>
						</TR>
					</template>


				</TABLE>
			</DIV>
	</div>
<script src="../../js/vue.js"></script>
<script src="../../js/elementUI.js"></script>
<script src="../../js/axios.js"></script>
<script src="../../js/qs.js"></script>
	<script>
		var v = new Vue({
			el : "#app",
			data : {
				boards:[]
			},
			created(){
				axios.get("../../board/query").then(res=>{
					this.boards = res.data;
				});
			},
			methods : {}
		})
	</script>
</body>
</html>